<template>
    <div class="div">
        <Yemei></Yemei>
        <h1>欢迎来到ip查询</h1>
        <el-input v-model="form.ip" placeholder="请输入要查询的ip"></el-input> 
        <el-button type="primary" round @click="fangd()">查询</el-button>
        <div v-show="bd">
            <h2>ip:{{this.data.ip}}</h2>
            <h2>地区：{{this.data.country}}{{this.data.province}}</h2>
             <h2>供应商：{{this.data.type}}</h2>
        </div>
        
    </div>
</template>

<script>

import Yemei from"../components/Yemei.vue"
import {userLista} from '../request/api'
export default {
    components: {
    Yemei
  },data(){
      return{
          data:'',
          fd:true,
          bd:false,
          dsq:null,
          form:{
            appkey:'94c263ad5bdebbed',
            ip:'',

          }
      }
      
  },
  methods:{
chaxu(){
        if(this.form.ip){
              userLista(this.form).then(res=>{
            console.log(res.data.result) 
            this.data = res.data.result;
            console.log(res.data.msg);
            res.data.msg=='ok'?this.bd=true:alert('输入的ip有误')
            
        })
        }else{
          alert('不能输入空白')
        }
      
    },
    fangd(){
       

        if(this.fd){
            this.chaxu()
            this.fd=false;
            console.log(this.fd);
        }
    
    if(this.dsq){
        clearTimeout(this.dsq);
        console.log("这里是清除定时器");
    }
        this.dsq = setTimeout(()=>{ 
            console.log(this.fd);
            this.fd=true},1000)
    },
    jsq(){
        
    }
    
     
  }
    
  }

</script>

<style>
.div{
    text-align: center;
}
</style>